<%--
  Created by IntelliJ IDEA.
  User: YYY-Work
  Date: 2017/5/5
  Time: 10:57
  To change this template use File | Settings | File Templates.
--%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%@ taglib prefix="s" uri="/struts-tags" %>
<%
    String path = request.getContextPath();
    String basePath = request.getScheme() + "://"
            + request.getServerName() + ":" + request.getServerPort()
            + path;
%>
<!DOCTYPE>
<html>
<head>
    <title>Title</title>
    <meta charset="UTF-8">
    <title>AdminLTE | Data Tables</title>
    <meta content='width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no' name='viewport'>

    <script type="text/javascript" src="<%=basePath%>/js/jquery-2.1.1.min.js"></script>
    <script type="text/javascript" src="<%=basePath%>/js/jquery.form.min.js"></script>
    <script type="text/javascript" src="<%=basePath%>/js/admin/utils.js"></script>
    <link href="../../css/bootstrap.min.css" media="all" rel="stylesheet" type="text/css"/>
    <script src="../../js/bootstrap.js" type="text/javascript"></script>
    <link href="<%=basePath%>/css/fileinput.css" media="all" rel="stylesheet" type="text/css"/>
    <link href="<%=basePath%>/themes/explorer/theme.css" media="all" rel="stylesheet" type="text/css"/>
    <script src="<%=basePath%>/js/sortable.js" type="text/javascript"></script>
    <script src="<%=basePath%>/js/fileinput.js" type="text/javascript"></script>
    <script src="<%=basePath%>/js/locales/zh.js" type="text/javascript"></script>
    <script src="<%=basePath%>/js/locales/es.js" type="text/javascript"></script>
    <script src="<%=basePath%>/themes/explorer/theme.js" type="text/javascript"></script>

</head>
<body class="skin-blue">

<!-- header logo: style can be found in header.less -->

<!-- getHeader -->
<s:action name="getHeader" namespace="/privilege" executeResult="true"/>
<div class="wrapper row-offcanvas row-offcanvas-left">
    <!-- Left side column. contains the logo and sidebar -->

    <!-- getMenus -->
    <s:action name="getMenus" namespace="/privilege" executeResult="true"/>

    <!-- Right side column. Contains the navbar and content of the page -->
    <aside class="right-side">
        <!-- Content Header (Page header) -->
        <section class="content-header">
            <h1>

                <small>新增咨询</small>
            </h1>
            <ol class="breadcrumb">
                <li><a href="#"><i class="fa fa-dashboard"></i> Home</a></li>
                <li><a href="#">Tables</a></li>
                <li class="active">Data tables</li>
            </ol>
        </section>

        <!-- Main content -->
        <section class="content">
            <div class="row">
                <div class="col-xs-12">
                    <div class="box">

                        <div class="box box-danger">

                            <div class="box-body">

                                <form id="form" class="form-horizontal" enctype="multipart/form-data" method="post" action="<%=basePath%>/advertisement/ajaxAddAdvertisementList.action">
                                    <fieldset>
                                        <!--标题-->
                                        <div class="form-group">
                                            <label class="col-sm-1 control-label">标题</label>
                                            <div class="col-sm-2">
                                                <input type="text" id="advertisementName" name="advertisementName" class="form-control"placeholder="标题">
                                            </div>
                                        </div>

                                        <!--展示位置-->
                                        <div class="form-group">
                                            <label class="col-sm-1 control-label">展示位置</label>
                                            <div class="col-sm-2">
                                                <select class="form-control" id="positionid" name="positionid">
                                                    <option value="1">用户头部广告</option>
                                                    <option value="2">育儿科普</option>
                                                    <option value="3">医生通知</option>
                                                    <option value="4">小儿食疗</option>
                                                </select>
                                            </div>
                                        </div>

                                        <!--描述-->
                                        <div class="form-group">
                                            <label class="col-sm-1 control-label">描述</label>
                                            <div class="controls col-sm-9">
                                                <div class="textarea">
                                                    <textarea id="advertisementDesc" name="advertisementDesc" type="" rows="3" class="form-control" style="width: 100%"></textarea>
                                                </div>
                                            </div>
                                        </div>

                                        <!--图片-->
                                        <div class="form-group">
                                            <label class="col-sm-1 control-label">选择图片</label>
                                            <div class="col-sm-4">
                                                <input id="advertisementImage" name="advertisementImage" class="file" type="file">
                                            </div>
                                        </div>

                                        <!--链接-->
                                        <div class="form-group">
                                            <label class="col-sm-1 control-label">链接地址</label>
                                            <div class="col-sm-9">
                                                <input type="text" class="form-control" id="clickLinkUrl" name="clickLinkUrl" placeholder="连接地址">
                                            </div>
                                        </div>

                                        <!--推荐医生-->
                                        <div class="form-group">
                                            <lable class="col-sm-1 control-label" style="text-align: right">推荐医生</lable>
                                            <div class="col-sm-2">

                                                <div id="stuff_name">
                                                </div>

                                                <input id="stuff_id" name="recommendStuffId" style="display: none" />
                                                <div id="stuff_img">
                                                </div>

                                                <div>
                                                    <button class="btn btn-success btn-xs" onclick="selectDoctor()" type="button">
                                                        选择
                                                    </button>
                                                    <button class="btn btn-danger btn-xs" onclick="removeSelectDoctor()" type="button">
                                                        移除
                                                    </button>
                                                </div>


                                            </div>

                                        </div>

                                        <div class="form-group">
                                            <label class="col-sm-1 control-label">阅读量</label>
                                            <div class="col-sm-3">
                                                <input type="number" class="form-control" name="readedAmount" placeholder="阅读量">
                                            </div>
                                        </div>

 										<div class="form-group">
                                            <label class="col-sm-1 control-label">标签</label>
                                            <div class="col-sm-6">
                                                <input type="text" class="form-control" name="advertiseTag" placeholder="标签">(半角逗号分隔)
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            <label class="col-sm-1 control-label">摘要</label>
                                            <div class="col-sm-6">
                                                <input type="text" class="form-control" name="advertShowData"
                                                       placeholder="摘要">
                                            </div>
                                        </div>
                                        

                                        <div class="form-group">
                                            <label class="col-sm-1" style="text-align: right">是否启用</label>
                                            <div class="controls col-sm-2">
                                                <label class="radio inline">
                                                    <input name="isUsedFlag" type="radio" checked="checked" value="1">
                                                    启用
                                                </label>
                                                <label class="radio inline">
                                                    <input name="isUsedFlag" type="radio" value="-1">
                                                    不启用
                                                </label>
                                            </div>
                                        </div>

                                        
                                        <div class="form-group" id="listdetails">
											<div class="box-body table-responsive col-sm-9 col-sm-offset-1" id="listDiv">

												<table cellpadding="3" cellspacing="1"
													class="table table-bordered table-hover" id="picture-table">
                                                     <tbody id="impression-table-body">
                                                     <tr>
                                                     <th align="center" width="18%">子标题</th>
                                                     <th align="center" width="26%">段落描述</th>
                                                     <th align="center" width="30%">图片</th>
                                                     <th align="center" width="8%">排序</th>
                                                     <th align="center" width="10%">&nbsp;</th>
                                                     <th align="center" width="8%">

                                                     <button type="button" onclick='addImpressonItem(this)' class="btn btn-success pull-right"><i class="fa fa-plus-square"></i> 新增</button>

                                                     </th>
                                                     </tr>
                                                    </tbody>
												</table>
											</div>
											<!-- /.box-body -->
										</div>

                                  	 <div class="form-group">
                                            <label class="col-sm-1 control-label"></label>

                                            <div class="controls col-sm-4">
                                                <button class="btn btn-success" type="submit">保存</button>
                                                <button class="btn" type="reset">重置</button>
                                                <button class="btn btn-primary" type="button">发布</button>
                                            </div>
                                        </div>
                                    </fieldset>
                                </form>

                            </div><!-- /.box-body -->
                        </div><!-- /.box -->

                    </div><!-- /.box -->


                </div>
            </div>

        </section><!-- /.content -->
    </aside><!-- /.right-side -->
</div><!-- ./wrapper -->
<script type="text/javascript">

    		function addImpressonItem(obj) {

			//当前td的父节点tr的父节点tbody
			 var src = obj.parentNode.parentNode;
			//得到当前行的索引,tr索引是从0开始算起
			var idx = rowindex(src);
			
			//直接得到表格
			var tbl = document.getElementById('picture-table');
			//表格总行数-2
			var length_top = tbl.rows.length - 1;
			//得到当前表有多少tr(除了表头 )
			var length = tbl.rows.length;
			var singleTable = $('#impression-table-body');
			var cindex = length-1;
			var content = "<tr>"
					
					+ "						<td> "
					+ "							<input type='text'  name='advertisementListDatas["+cindex+"].dataName'   rows='6' cols='12'   class='form-control'/>  "
					+ "						</td>"
					+ "						<td > "
					+ "							<textarea  name='advertisementListDatas["+cindex+"].dataDesc'   rows='6' cols='35' class='form-control' ></textarea>"
					+ "						</td>"
					
					+ "<td>"
					
					
						// onchange="PreviewImage(this,'imgHeadPhoto_<s:property value='#st.index'/>','divPreview_<s:property value='#st.index'/>')"> 
					
					
					+ "   <input type='file' class='form-control' name='advertisementListDatas["+cindex+"].img' "
					+ "   />  "
				
					+"</td>    "
					
					+ "	<td>"
					+ "						<select name='advertisementListDatas["+cindex+"].dataOrder' class='impressionOrder'  >"
					+ "								<option value='0'>请选择</option>"
					+ "					 		 	<option value='1'>1</option>"
					+ "								<option value='2'>2</option>"
					+ "							 	<option value='3'>3</option>"
					+ "								<option value='4'>4</option>"
					+ "								<option value='5'>5</option>"
					+ "								<option value='6'>6</option>"
					+ "								<option value='7'>7</option>"
					+ "								<option value='8'>8</option>"
					+ "								<option value='9'>9</option>"
					+ "								<option value='10'>10</option>"
					+ "								<option value='11'>11</option>"
					+ "								<option value='12'>12</option>"
					+ "								<option value='13'>13</option>"
					+ "								<option value='14'>14</option>"
					+ "								<option value='15'>15</option>"
					+ "						</select>"
					+ "						</td>"
					+ "                     <td>&nbsp;</td>    "
					+"	<td  align='center' id='dropImpressonItem_"+length+"'><button type='button' onclick='dropImpressonItem(this)' class='btn btn-primary pull-right'><i class='fa fa-minus-square'></i> 删除</button></td>"
					+ "</tr>";
			singleTable.append(content);
		}

		function dropImpressonItem(obj) {
			//得到当前所在的有tr-index
			var row = rowindex(obj.parentNode.parentNode);
			var row_top = row - 1;
			var tbl = document.getElementById('picture-table');
			//删除这行
			tbl.deleteRow(row);
			//   alert(row_top);
			if (row_top > 1) {
				document.getElementById("dropImpressonItem_" + row_top).innerHTML = "<td  align='center' class='label' id='dropImpressonItem_"+row_top+"'><a href='javascript:;' onclick='dropImpressonItem(this)'>[删除]</a></td>";

			}

		}
    
    
    
</script>

<div class="modal fade" id="selectDoctorModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <h4 class="modal-title" id="myModalLabel">添加医生</h4>
                <div style="margin-top: 15px;vertical-align: middle;">
                    <form id="search-doctor-form">
                        <input type="text" id="stuff_search_name" name="stuffName" class="col-sm-3" style="padding-top: 3px;padding-bottom: 3px" placeholder="请输入医生姓名">
                        <input name="currentPage" type="text" value="1" style="display: none">
                        <input name="pageSize" type="text" value="100" style="display: none">
                    </form>
                    <button type="button" class="btn btn-primary btn-sm" style="margin-left: 15px" onclick="searchStuff()">查询</button>
                </div>
            </div>
            <div class="modal-body" id="doctor-list" style="height: 400px;max-height:400px;overflow:scroll">

            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
            </div>
        </div><!-- /.modal-content -->
    </div><!-- /.modal -->
</div>

</body>
<style type="text/css">
    th
    {
        text-align: center;
    }
</style>
<script type="text/javascript">
    $("#advertisementImage").fileinput({
        language: 'zh', //设置语言 
        showUpload: false, //是否显示上传按钮  
        showCaption: true,//是否显示标题  
        allowedPreviewTypes: ['image'],
        allowedFileTypes: ['image'],
        allowedFileExtensions:  ['jpg', 'png'],
    });

    function searchStuff() {
        var formData =new FormData($('#search-doctor-form')[0]);//
        $.ajax({
            type:"POST",
            url:"<%=basePath%>/stuff/ajaxQueryStuffForSelect.action",
            data:formData,
            async: false,
            contentType: false,
            processData: false,
            error: function(request) {
                alert("网络异常");
            },
            success: function(data) {
                data=JSON.parse(data);
                if(!Utils.isEmpty(data.content))
                {
                    $("#doctor-list").empty();
                    $("#doctor-list").append(data.content);
                }
            }
        });
    }

    function selectDoctor() {
        $("#selectDoctorModal").modal('show')
    }

    function removeSelectDoctor() {

        $("#stuff_name").empty();
        $("#stuff_id").val("");
        $("#stuff_img").empty();

    }

    function onStuffSelect(stuffid,stuffName,iconUrl) {

        $("#stuff_name").empty();
        $("#stuff_name").append("<label>"+stuffName+"</label>");
        $("#stuff_id").val(stuffid);
        $("#selectDoctorModal").modal('hide')

    }

</script>
</html>
